@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&family=Oswald:wght@200..700&display=swap');
:root {
    /* COLOURS */
    --c-brand:     #0066b1;
    --c-black:     #000000;
    --c-white:     #FFFFFF;
    --c-shadow:    rgba(71, 71, 71, 0.7);
    --c-lines:     #B2B2B8;
    --c-altbg:     #212121;
    --c-light-bg:  #F6F6F6;
    --c-d-overlay: rgba(0, 0, 0, 0.3);
    --c-l-overlay: rgba(255, 255, 255, 0.5);
    --c-brand-dark: color-mix(in oklab, var(--c-brand), black 10%);
    --c-brand-light: color-mix(in oklab, var(--c-brand), white 10%);
    /* FONTS */
    --f-headings: Oswald, sans-serif;
    --f-showroom: Onest, sans-serif;
    --f-size:     16px;
    --f-weight:   400;
    /* SIZES */
    --s-gutter:   25px;
    --s-grid-gap: 25px;
    --s-pad-unit: 25px;
    --s-nav-gap:  15px;
    --s-logo-h:   70px;
    /* HEADINGS */
    --h-h1:      calc(1.375rem + 1.5vw);
    --h-h2:      calc(1.375rem + 0.9vw);
    --h-h3:      calc(1.375rem + 0.6vw);
    --h-h4:      calc(1.375rem + 0.3vw);
    --h-h5:      1.25rem;
    --h-h6:      1rem;
    --h-h1-1200: 2.5rem;
    --h-h2-1200: 2rem;
    --h-h3-1200: 1.75rem;
    --h-h4-1200: 1.5rem;
    --h-h5-1200: 1.25rem;
    --h-h6-1200: 1rem;
}